<template>
  <div class="execution">
    <basic-container>
      <div class="sw-revenue-daily-report-cycle">
        <el-form :inline="true">
          <el-form-item label="日期">
            <el-date-picker
              v-model="search.date"
              type="daterange"
              range-separator="至"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              value-format="yyyy-MM-dd"
              style="width:450px"
            >
            </el-date-picker>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="onSearch">查询</el-button>
            <el-button type="primary" @click="handleExcelWrite"
              >导 出
            </el-button>
          </el-form-item>
        </el-form>
        <table class="el-table el-table--border"  v-loading="loadingShow" element-loading-text="数据正在加载中...">
          <thead>
            <tr>
              <th colspan="2" class="bold">票款收入</th>
              <th colspan="2" class="bold">合计</th>
            </tr>
          </thead>
          <tr>
            <td rowspan="4" class="bold center">TVM<br />收入</td>
            <td class="center" width="250">钱箱票款</td>
            <td colspan="2">{{ reportData.cashBox.toFixed(2) }}</td>
          </tr>
          <tr>
            <td class="center">补币金额</td>
            <td colspan="2">{{ reportData.supplment.toFixed(2) }}</td>
          </tr>
          <tr>
            <td class="center">手工清出</td>
            <td colspan="2">{{ reportData.hand.toFixed(2) }}</td>
          </tr>
          <tr>
            <td class="bold center">小计</td>
            <td colspan="2">{{ reportData.subTvmTotal.toFixed(2) }}</td>
          </tr>
          <tr>
            <td rowspan="4" class="bold center">BOM<br />收入</td>
            <td class="center">营销车票</td>
            <td colspan="2">{{ reportData.marketTicket.toFixed(2) }}</td>
          </tr>
          <tr>
            <td class="center">预制单程票</td>
            <td colspan="2">{{ reportData.yzdcp.toFixed(2) }}</td>
          </tr>
          <tr>
            <td class="center">应急纸票</td>
            <td colspan="2">{{ reportData.yjzp.toFixed(2) }}</td>
          </tr>	 
          <tr>
            <td class="bold center">BOM实收总金额小计</td>
            <td colspan="2">{{ reportData.subBomTotal.toFixed(2) }}</td>
          </tr>
          <tr>
            <td colspan="2" class="bold center">补售票员短款</td>
            <td colspan="2">{{ reportData.conductorShort.toFixed(2) }}</td>
          </tr>
          <!-- <tr>
            <td colspan="2" class="bold center">加收票款</td>
            <td colspan="2">{{ reportData.addMoney.toFixed(2) }}</td>
          </tr> -->
          <tr>
            <td colspan="2" class="bold center">值站交接长款</td>
            <td colspan="2">{{ reportData.conductorLong.toFixed(2) }}</td>
          </tr>
          <tr>
            <td colspan="2" class="bold center">其它票款金额</td>
            <td colspan="2">{{ reportData.other.toFixed(2) }}</td>
          </tr>
          <tr>
            <td colspan="2" class="bold center">营收总金额</td>
            <td colspan="2">{{ reportData.total.toFixed(2) }}</td>
          </tr>
          <tr>
            <td colspan="1" class="center">录入人</td>
            <td class="center">{{ reportData.passengerAttendName }}</td>
            <td class="center">录入人员工号</td>
            <td class="center">{{ reportData.passengerAttendJobNo }}</td>
          </tr>
          <tr>
            <td colspan="1" class="center">复核人</td>
            <td class="center" width="190">{{ reportData.attendName }}</td>
            <td class="center" width="230">复核人员工号</td>
            <td class="center" width="190">{{ reportData.attendJobNo }}</td>
          </tr>
        </table>
      </div>
    </basic-container>
  </div>
</template>

<script>
import request from "@/router/axios";
import { handleExcelResponse } from "@/util/util";

export function exportByPageContentForCycle(query) {
  return request({
    url: "/stm/swstreportquery/exportByPageContentForCycle",
    method: "post",
    data: query,
    responseType: "blob",
    headers: {
      "Content-Type": "application/json;charset=UTF-8"
    }
  });
}
export default {
  name: "swrevenuedailyreport",
  data() {
    return {
      search: {
        date: ""
      },
      startTime: '',
      endTime: '',
      defaultAddForm: {},
      reportData: {
        cashBox: 0.00, //钱箱票款
        supplment: 0.00, //补币金额
        hand: 0.00, //手工清出
        subTvmTotal: 0.00,
        boxDiff: 0, //钱箱差额
        marketTicket: 0.00, //营销车票
        dayTicket: 0.00, //日票
        yzdcp: 0.00, //预制单程票
        yjzp: 0.00, //应急纸票	
        subBomTotal: 0.00, //BOM实收总金额小计
        conductorShort: 0.00, //补售票员短款
        addMoney: 0.00, //加收票款
        conductorLong: 0.00, //客值交接长款
        other: 0.00, //其他
        total: 0.00, //营收总金额
        remark: "", //备注
        passengerAttendName: "", //客运值班员
        passengerAttendJobNo: "", //客运值班员工号
        attendName: "", // 复核人
        attendJobNo: "" //复核人工号
      },
      loadingShow: false
    };
  },
  computed: {},
  created() {
    this.defaultAddForm = JSON.parse(JSON.stringify(this.reportData))
  },
  methods: {
    onSearch() {
      if(!this.validatenull(this.search.date)){
        this.startTime=this.search.date[0];
        this.endTime=this.search.date[1];
      }else{
        this.startTime = '';
        this.endTime = '';
        //使用深度拷贝清空表单
        this.reportData = JSON.parse(JSON.stringify(this.defaultAddForm));
      }
      if(this.validatenull(this.startTime)&&this.validatenull(this.endTime)){
        this.$message.warning("请选择开始日期和结束日期");
      }else{
        this.loadingShow = true;
        request({
          url: "/stm/swstreportquery/stationincomerealtime?startTime=" + this.startTime + "&endTime=" + this.endTime,
          method: "get"
        }).then(res => {
          if (res.data.data) {
            this.reportData = res.data.data;
          }
          this.loadingShow = false;
        }).catch(error=> {
            this.loadingShow = false;
        })
      }
    },
    async handleExcelWrite() {
      // 导出
      let reqdata = this.reportData;
      reqdata.startTime = this.startTime;
      reqdata.endTime = this.endTime;
      let p = JSON.stringify(reqdata);
      let res = await exportByPageContentForCycle(p);
      handleExcelResponse(res, "车站营收日报表.xlsx");
    }
  }
};
</script>
<style lang="scss" scoped>
.sw-revenue-daily-report-cycle {
  table {
    border: 1px solid #b7babf;
    th {
      text-align: center;
      border: 1px solid #b7babf;
    }
    td {
      padding: 12px 10px;
      border: 1px solid #b7babf;
    }
    &.el-table--border::after,
    &.el-table::before {
      background-color: #b7babf;
    }
    width: 70%
  }
  .center {
    text-align: center;
  }
  .forms{
    text-align: center;
  }
  .bold {
    font-weight: bold;
  }
}
</style>
